<template>
  <view class="news-list">
    <!-- 移除外层多余的循环，直接循环newsList -->
    <cardViewText 
      v-for="(item, index) in newsList" 
      :key="index" 
      :title="item.title" 
      :isTop="item.isTop" 
      :author="item.author" 
      :comments="item.comments" 
      :time="item.time" 
      :showSearch="item.showSearch" 
      :tags="item.tags" 
    >
      <!-- 插槽必须写在组件标签内部（作用域正确） -->
      <template v-slot:tips>
        <view class="slotcontent" v-if="item.showSearch">
          <text>搜索</text>
          <view class="borderbox"><text>今日金价</text></view>
          <view class="borderbox"><text>精选好物</text></view>
        </view>
      </template>
    </cardViewText>
  </view>
</template>

<script>
import cardViewText from "../../components/cardViewText.vue"
export default {
  components: {
    cardViewText
  },
  data() {
    return {
      newsList: [
        {
          title: "14个月从100家开到1000家门店，蜜雪冰城为何买下这家精酿啤酒商",
          isTop: true,
          author: "界面新闻",
          comments: 56,
          time: "2025.10.07"
        },
        {
          title: "把握历史大势 共创美好未来（观沧海）",
          isTop: false,
          author: "人民日报",
          comments: 1025,
          time: "2025.10.25"
        },
        {
          title: "黄金还能走多远？卖方高呼“第三浪启动”，230多份研报看多",
          isTop: false,
          author: "财联社",
          comments: 452,
          time: "2025.10.08",
          showSearch: true,
        },
        {
          title: "“没有短板”的完美战鹰！歼-16机库独家探访",
          isTop: false,
          author: "红星新闻",
          comments: 56,
          time: "2025.10.07"
        },
        {
          title: "多国学者共探巴克特里亚考古 携手推进丝绸之路文明研究新进程",
          isTop: false,
          author: "中国日报网",
          comments: 56,
          time: "2025.10.12"
        }
      ]
    }
  }
}
</script>

<style scoped>
.news-list {
  padding: 10rpx;
}
/* 补充插槽内容样式 */
.slotcontent {
  margin-top: 10rpx;
  font-size: 24rpx;
  color: #333;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.borderbox {
  border: 1px solid #ccc;
  border-radius: 8rpx;
  padding: 4rpx 12rpx;
  margin-left: 10rpx;
  margin-top: 5rpx;
}
</style>